<template>
    <div class="card rdsp-card-view" data-page="realTimeMoni">
        <div class="card-content rank-content card-content-padding">
            <div class="rdsp-card-title">
                <div class="left-title">探测器实时监测</div>
                <div class="rdsp-card-title-right">
                </div>
            </div>
            <div class="rdsp-card-con">
                <div class="realTimeMoni">
                    <ul>
                        <li class="police">
                            <a href="/moreDectorState/1/0/0/0/"  data-view=".view-main">
                                <div class="li-top">
                                    <div>
                                        <img src="{{staticPath}}img/home/realTimeMoni-police.png">
                                        <span>报警</span>
                                    </div>
                                </div>
                                <div class="num" id="alertNum_id">0</div>
                            </a>
                        </li>
                        <li class="fault">
                            <a href="/moreDectorState/2/0/0/0/"  data-view=".view-main">
                                <div class="li-top">
                                    <div>
                                        <img src="{{staticPath}}img/home/realTimeMoni-fault.png">
                                        <span>故障</span>
                                    </div>
                                </div>
                                <div class="num" id="faultNum_id">0</div>
                            </a>
                        </li>
                        <li class="shield">
                            <a href="/moreDectorState/3/0/0/0/"  data-view=".view-main">
                                <div class="li-top">
                                    <div>
                                        <img src="{{staticPath}}img/home/realTimeMoni-shield.png">
                                        <span>屏蔽</span>
                                    </div>
                                </div>
                                <div class="num" id="shelNum_id">0</div>
                            </a>
                        </li>
                        <li class="linkage">
                            <a href="/moreDectorState/4/0/0/0/"  data-view=".view-main">
                                <div class="li-top">
                                    <div>
                                        <img src="{{staticPath}}img/home/realTimeMoni-linkage.png">
                                        <span>联动</span>
                                    </div>
                                </div>
                                <div class="num" id="linkage_id">0</div>
                            </a>
                        </li>
                        <li class="normal">
                            <a href="/moreDectorState/5/0/0/0/"  data-view=".view-main">
                                <div class="li-top">
                                    <div>
                                        <img src="{{staticPath}}img/home/realTimeMoni-normal.png">
                                        <span >正常</span>
                                    </div>
                                </div>
                                <div class="num" id="normalNum_id">0</div>
                            </a>
                        </li>
                    </ul>
                    <div class="realTimeMoni-allCount"></div>
                    <div class="realTimeMoni-list">
                      <div class="realTimeMoni-list-item" id="realTimeMoni-alert-content"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
<style scoped>
</style>
<script>
return {
    data: function() {
        return {}
    },
    methods: {
        showDecterStateNum:function(){
                var id_org="";
                if (single_Orgid == "") {
                    id_org=userInfor.organizationIds;
                } else {
                    id_org=single_Orgid;
                }
                Dao.getFcfRealTimeStatusMultiCount({
                    userName: userInfor.accountName,
                    deviceId: appKeyObj.deviceId,
                    orgIds:id_org
                }, function (data) {
                    $("#normalNum_id").empty();
                    $("#alertNum_id").empty();
                    $("#faultNum_id").empty();
                    $("#shelNum_id").empty();
                    $("#linkage_id").empty();
                    $("#normalNum_id").append(
                        common.transNullundefined(data.normalCount.toString())
                    )
                    $("#alertNum_id").append(
                        common.transNullundefined(data.fireAlarmCount.toString())
                    )
                    $("#faultNum_id").append(
                        common.transNullundefined(data.faultAlarmCount.toString())
                    )
                    $("#shelNum_id").append(
                        common.transNullundefined(data.shieldAlarmCount.toString())
                    )
                    if(data.linkageAlarmCount){
                       $("#linkage_id").append(
                        common.transNullundefined(data.linkageAlarmCount.toString())
                        ) 
                    }else{
                        $("#linkage_id").append("0");
                    }
                }, true)
            },
            
            getFirstAlert: function () {
                var self = this;
                var $ = self.$$;
                var total=0;
                if (single_Orgid == "") {
                    self.id_org = userInfor.organizationIds;
                } else {
                    self.id_org = single_Orgid;
                }
                $("#realTimeMoni-alert-content").empty();
                Dao.getAlarmInfo({
                    userName: userInfor.accountName,
                    deviceId: appKeyObj.deviceId,
                    orgIds: self.id_org,
                    fireTTypes: 10
                }, function (data) {
                    if(data && data.length>0){
                        var createTimeStr="";
                        var time=data[0].createTimeStr.toString();
                        var now=new Date();
                        var date=((now.getMonth()+1)<10?"0":"")+(now.getMonth()+1)+"-"+(now.getDate()<10?"0":"")+now.getDate();
                        if(time.indexOf(date)){
                            createTimeStr=time.substring(5,16);
                        }else{
                            createTimeStr=time.substring(11,16);
                        }
                        var image = null;
                        if (data[0].detailPic != null && data[0].detailPic != "") {
                            var imageObj = JSON.parse(data[0].detailPic);
                            image = imageObj.icon;
                        }
                        $("#realTimeMoni-alert-content").append(`
                            <a data-view=".view-main" href="/eqmentMsg/`+data[0].fcFacilitiesId+`/">
                                <div class="left-block">
                                  <img src="`+picDecterNo(image)+`">
                                </div>
                                <div class="right-block">
                                  <h3><span class="realTimeMoni-fcFacilitiesName">`+data[0].fcFacilitiesName+`</span><em class="bgred">首警</em></h3>
                                  <div class="location"><i class="iconfont icon-dingwei1"></i>`+data[0].fcFacilitiesAddress+`</div>
                                  <p class="time">`+createTimeStr+`</p>
                                </div>
                            </a>
                        `);
                    } else{
                        $(".realTimeMoni-list").css("margin-top","0");
                    }
                });
            },
            showAlarmTotalCount:function(){
                var id_org="";
                if (single_Orgid == "") {
                    id_org=userInfor.organizationIds;
                } else {
                    id_org=single_Orgid;
                }
                Dao.getAlarmTotalCount({
                    userName: userInfor.accountName,
                    deviceId: appKeyObj.deviceId,
                    orgIds:id_org,
                    dataType: 0
                }, function (data) {
                    $(".realTimeMoni-allCount").empty().append("实时警情总数"+data.totalCount+",其中未处理总数为"+data.unHandlerCount);
                    if(data.notNormalCount==0){
                        $(".realTimeMoni-allCount").css("margin-top","13px");
                    }
                }, true)
            },
    },
    on: {
        pageInit: function(e, page) {
        },
        pageAfterIn: function(e, page) {
            var self = this;
            self.showDecterStateNum();
            self.getFirstAlert();
            self.showAlarmTotalCount();
        }
    }
}
</script>